<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<style type="text/css">
			#picker{
				height: 100px;
				width: 200px;
				overflow: hidden;
				background-color: #DDDDDD;
			}
			
			#picker ul
			{
				padding: 0;
				list-style: none;
			}
			
			#picker ul li
			{
				color: #CCCCCC;
				align-items: center;
				text-align: center;
				padding: 2px 5px;
			}
			
			#picker ul li span{
				margin: 0 auto;
			}
			
			#picker ul li.selected
			{
				color: #000000;
				font-size: 24px;
			}
			
			#picker-ul{
				position: relative;
				top: -25px;
			}
		</style>
	</head>

	<body>
		<div id="picker">
			<ul id="picker-ul">
				<li>
					<span>1200</span>
				</li>
				<li>
					<span>1300</span>
				</li>
				<li class="selected">
					<span>1400</span>
				</li>
				<li>
					<span>1500</span>
				</li>
				<li>
					<span>1600</span>
				</li>
				<li>
					<span>1700</span>
				</li>
				<li>
					<span>1800</span>
				</li>
				<li>
					<span>1900</span>
				</li>
				<li>
					<span>2000</span>
				</li>
				<li>
					<span>2100</span>
				</li>
				<li>
					<span>2200</span>
				</li>
				<li>
					<span>2300</span>
				</li>
			</ul>
		</div>
		<script src="js/mui.min.js"></script>
		<script type="text/javascript">
			mui.init()
		</script>
	</body>

</html>